// import React from 'react';
import { InlineMath, BlockMath } from 'react-katex';
import 'katex/dist/katex.min.css'; // 引入样式

function MathExample() {
  return (

    <div style={{ 
      maxWidth: '800px', 
      margin: '0 auto', 
      padding: '20px',
      fontFamily: 'Arial, sans-serif'
    }}>
      <h2 style={{ 
        color: '#2c3e50', 
        borderBottom: '2px solid #3498db', 
        paddingBottom: '10px',
        marginBottom: '30px'
      }}>
        数学公式例子
      </h2>
      {/* 行内公式 */}
      <p>
        欧拉恒等式是数学中最优美的公式之一：
        <InlineMath math="e^{i\pi} + 1 = 0" />
      </p>
      
      {/* 块级公式（单独成行） */}
      <p>微积分中的牛顿-莱布尼茨公式：</p>
      <BlockMath math="\int_{a}^{b} f(x) dx = F(b) - F(a)" />
      
      {/* 复杂公式示例 - 拉格朗日方程 */}
      <p>经典力学中的拉格朗日方程：</p>
      <BlockMath math="\frac{d}{dt} \left( \frac{\partial \mathcal{L}}{\partial \dot{q}_j} \right) = \frac{\partial \mathcal{L}}{\partial q_j}" />
    </div>
  );
}

export default MathExample;